layui.define(['jquery'], function (exports) {
  var $ = layui.jquery
  var scrollSetp = 500
  var operationWidth = 100
  var leftOperationWidth = 30
  var animatSpeed = 150
  var addTabAnimate = 'zoomIn'
  var removeTabAnimate = 'zoomOut'
  var closeOther = 'removeOther'
  var closeAll = 'removeAll'
  var normalTab = null
  //	layui.link(layui.context+"/static/comp/tabs/tabs.css");
  var f = function () {}
  /**
	 * config:
		  {
		   id:string,
		   title:string,
		   url:url,
		   icon:iconClass,
		   closable:true|false
		   }
	 */
  $.fn.btab = function () {
    var thisObj = $(this)
    var _this = this
    var _pageTabObj, _menuListObj, _menuAllObj, _menuAllUlObj, _pageTabContent, _pageContentObj, _pagePrevObj, _pageNextObj, _selectMenuList, _selectIframe, _selectMenuUl
    /**
		 * 初始化Tab
		 */
    _this.init = function () {
      $('<div class="page-tab">' +
	          '  <button class="tab-btn page-prev"><em class="fa fa-chevron-left"></em></button>' +
	          '  <div class="page-tab-content">' +
	          '      <div class="menu-list"></div>' +
	          '  </div>' +
	          '  <button class="tab-btn page-next"><em class="fa fa-chevron-right"></em></button>' +
	          '  <div class="page-operation">' +
			  '	   <button class="tab-btn page-operation"><em class="fa fa-list"></em></button>' +
			  '	   <div class="menu-all animated flipInY">' +
			  '	     <ul class="menu-all-ul"><li data-value="' + closeOther + '">关闭其他</li><li data-value="' + closeAll + '">关闭全部</li></ul>' +
			  '	   </div>' +
	          '  </div>' +
	          '</div>' +
	          '<div class="page-content"></div>').appendTo(thisObj)
      _pageTabObj = thisObj.find('.page-tab')[0]
      _menuListObj = thisObj.find('.menu-list')[0]
      _menuAllUlObj = thisObj.find('.menu-all-ul')[0]
      _menuAllObj = thisObj.find('.menu-all')[0]
      _pageOperationObj = thisObj.find('.page-operation')[0]
      _pageContentObj = thisObj.find('.page-content')[0]
      _pageTabContent = thisObj.find('.page-tab-content')[0]
      _pagePrevObj = thisObj.find('.page-prev')[0]
      _pageNextObj = thisObj.find('.page-next')[0]
      $(_pagePrevObj).bind('click', _this.toPrevPage)
      $(_pageNextObj).bind('click', _this.toNextPage)
      $(_pageOperationObj).bind('click', _this.showMenu)
      $(_menuAllUlObj).find("li[data-value='" + closeAll + "']").bind('click', function () {
        _this.removeAll()
        $(_menuAllObj).hide()
        event.stopPropagation()
      })
      $(_menuAllUlObj).find("li[data-value='" + closeOther + "']").bind('click', function () {
        _this.removeOther()
        $(_menuAllObj).hide()
        event.stopPropagation()
      })
      $('body').bind('mousedown',
        function (event) {
          if (!(event.target.className === 'menu-all' ||
							event.target.className === 'menu-all-ul' ||
							event.target.className === 'page-operation' ||
							event.target.className === 'page-operation' ||
							event.target.parentElement.className === 'menu-all-ul')) {
            $(_menuAllObj).hide()
          }
        })
    }
    _this.resizeTab = function () {
      var offset = thisObj.offset()
      var left = offset.left
      var top = offset.top

      var win = $(window)
      var width = win.width()
      var height = win.height()
      thisObj.css('width', width - left - 10)
      thisObj.css('height', height - top)
      $(_pageContentObj).css('height', height - top - 30)
    }
    /**
		 * 增加一个Tab选项卡
		 */
    _this.addTab = function (config) {
      var id = config.id
      var title = config.title

      var url = config.url
      var scroll = config.scroll == undefined ? true : config.scroll
      var closable = config.closable == undefined ? true : config.closable
      var icon = config.icon || ''
      var tabHtml = $('<div>', {
        id: 'tab_item_' + id,
        'data-value': id,
        class: 'tabitem animated ' + addTabAnimate,
        'data-closable': closable
      }).bind('click', function () {
        var jthis = $(this)
        var op = jthis.data('value')
        _this.linkFrame(jthis.data('value'))
      })
      if (icon != undefined && icon != '') {
        var iconHtml = $('i', {
          class: icon
        })
        tabHtml.append(iconHtml)
      }
      tabHtml.append(title)
      if (closable) {
        var iel = $('<i>', {
          class: 'menu-close fa fa-times'
        }).bind('click', _this.closeMenu)
        tabHtml.append(iel)
      }
      tabHtml.appendTo(_menuListObj)
      /*
		    *作者：sjm
       	    *时间：2018-05-17
		    *开发时注释掉begin
		    */

      /*
		    *开发时注释掉end
		    */

      $('<iframe>', {
        class: 'iframe-content',
        'data-value': id,
        id: 'tab_frame_' + id,
        allowFullScreen: 'true',
        scrolling: scroll ? 'yes' : 'no',
        src: url
      }).appendTo(_pageContentObj)

      $('<li>', {
        html: title,
        'data-value': id,
        id: 'tab_ul_' + id
      }).bind('click', function () {
        var jthis = $(this)
        _this.showTab(jthis.data('value'))
        $(_menuAllObj).hide()
        event.stopPropagation()
      }).appendTo(_menuAllUlObj)
    }
    /**
		 * 增加一个选项卡，此方法会自动判断Tab是否存在，如果存在，则显示，如果不存在，则添加
		 */
    _this.appendTab = function (config) {
      var id = config.id
      var exist = _this.existTab(id)

      if (!exist) {
        _this.addTab(config)
      } else {
        _this.removeTab(id)
        _this.addTab(config)
      }
      //
      _this.showTab(id)
    }
    /**
		 * 删除一个Tab选项卡
		 */
    _this.removeTab = function (tab, movetab) {
      var jthis = null
      var tabId = null
      if (movetab == undefined)movetab = true
      if (typeof (tab) === 'string' || typeof (tab) === 'number') {
        jthis = $(_menuListObj).find("div[data-value='" + tab + "']")
        tabId = tab
      } else {
        jthis = $(tab)
        tabId = jthis.data('value')
      }

      if (jthis.length == 0) {
        return
      }
      if (jthis.hasClass('active')) {
        var linext = jthis.next()
        while ($(linext).data('remove') == 'true') {
          linext = linext.next()
        }
        if (linext.length > 0) {
          linext.click()
          if (movetab)_this.moveTab(linext)
        } else {
          var liprev = jthis.prev()
          while ($(liprev).data('remove') == 'true') {
            liprev = liprev.prev()
          }
          if (liprev.length > 0) {
            liprev.click()
            if (movetab)_this.moveTab(liprev)
          }
        }
      }
      jthis.data('remove', 'true')
      $(jthis).addClass('closeable').animate({
        width: '0px'
      }, 0, function () {
        jthis.remove()
				 $(_pageContentObj).find(".iframe-content[data-value='" + tabId + "']").remove()
				 $(_menuAllUlObj).find("li[data-value='" + tabId + "']").remove()
      })

      event.stopPropagation()
    }

    /**
		 * 删除一个Tab选项卡
		 */
    _this.removeTab1 = function (tab, movetab) {
      var jthis = null
      var tabId = null
      if (movetab == undefined)movetab = true
      if (typeof (tab) === 'string' || typeof (tab) === 'number') {
        jthis = $(_menuListObj).find("div[data-value='" + tab + "']")
        tabId = tab
      } else {
        jthis = $(tab)
        tabId = jthis.data('value')
      }

      if (jthis.length == 0) {
        return
      }
      if (jthis.hasClass('active')) {
        var linext = jthis.next()
        while ($(linext).data('remove') == 'true') {
          linext = linext.next()
        }
        if (linext.length > 0) {
          linext.click()
          if (movetab)_this.moveTab(linext)
        } else {
          var liprev = jthis.prev()
          while ($(liprev).data('remove') == 'true') {
            liprev = liprev.prev()
          }
          if (liprev.length > 0) {
            liprev.click()
            if (movetab)_this.moveTab(liprev)
          }
        }
      }
      alert('aaccvv')
      jthis.data('remove', 'true')
      $(jthis).addClass('closeable').animate({
        width: '0px'
      }, 0, function () {
        jthis.remove()
				 $(_pageContentObj).find(".iframe-content[data-value='" + tabId + "']").remove()
				 $(_menuAllUlObj).find("li[data-value='" + tabId + "']").remove()
      })
    }

    /**
		 * 删除全部Tab选项卡
		 */
    _this.removeAll = function () {
      var allCanCloseTab = $(_menuListObj).find('div')
      var notClose = null
      $(allCanCloseTab).each(function (t) {
        var closable = $(allCanCloseTab[t]).data('closable')
        if (closable) {
          _this.removeTab(allCanCloseTab[t], false)
        } else {
          notClose = allCanCloseTab[t]
        }
      })
      if (notClose != null) {
        _this.showTab($(notClose).data('value'))
      }
    }
    /**
		 * 删除全部Tab选项卡
		 */
    _this.removeOther = function () {
      var allCanCloseTab = $(_menuListObj).find('div')
      var notClose = null
      $(allCanCloseTab).each(function (t) {
        var closable = $(allCanCloseTab[t]).data('closable')
        var hasActive = $(allCanCloseTab[t]).hasClass('active')
        if (closable && !hasActive) {
          _this.removeTab1(allCanCloseTab[t])
        }
      })
      if (notClose != null) {
        _this.showTab($(notClose).data('value'))
      }
    }

    /**
		 * 显示Tab
		 */
    _this.showTab = function (tabId) {
      _this.linkFrame(tabId)
      _this.moveTab(tabId)
    }
    //, _selectMenuList,_selectIframe,_selectMenuUl
    /**
		 * 显示Frame
		 */
    _this.linkFrame = function (tabId) {
      normalTab = tabId
      if (_selectMenuList != null) {
        $(_selectMenuList).removeClass('active')
        $(_selectIframe).removeClass('active')
        $(_selectMenuUl).removeClass('active')
      }
      _selectMenuList = $('#tab_item_' + tabId)
      _selectIframe = $('#tab_frame_' + tabId)
      _selectMenuUl = $('#tab_ul_' + tabId)
      $(_selectMenuList).addClass('active')
      $(_selectIframe).addClass('active')
      $(_selectMenuUl).addClass('active')
    }

    /**
		 * 判断是否存在一个Tab
		 */
    _this.existTab = function (tabId) {
      return $(_menuListObj).find("div[data-value='" + tabId + "']").length > 0
    }
    /**
		 * 返回Tab选项卡的总数
		 */
    _this.tabSize = function () {
      return $(_menuListObj).find('div').length
    }
    /**
		 * Tab页上移一页
		 */
    _this.toPrevPage = function () {
      var nav = $(_menuListObj)
      var left = parseInt(nav.css('margin-left'))
      if (left !== 0) {
        nav.animate({
          'margin-left': (left + scrollSetp > 0 ? 0
            : (left + scrollSetp)) +
							'px'
        }, animatSpeed)
      }
    }
    /**
		 * Tab页下移一页
		 */
    _this.toNextPage = function () {
      var nav = $(_menuListObj)
      var left = parseInt(nav.css('margin-left'))
      var wwidth = parseInt($('.page-tab').width())
      var navwidth = parseInt(nav.width())
      var menu = $(_menuListObj).find('div')
      if (menu.length > 0) {
        var last = $(menu[menu.length - 1])
        navwidth = last.offset().left + last.width()
      }
      var allshowleft = -(navwidth - wwidth + operationWidth)
      if (allshowleft !== left &&
					navwidth > wwidth - operationWidth) {
        var temp = (left - scrollSetp)
        nav.animate({
          'margin-left': (temp < allshowleft ? allshowleft
            : temp) +
							'px'
        }, animatSpeed)
      }
    }
    /**
		 * 关闭按钮事件
		 */
    _this.closeMenu = function () {
      var tabId = $(this.parentElement).data('value')
      _this.removeTab(tabId)
    }
    /**
		 * 移动Tab
		 */
    _this.moveTab = function (tab) {
      var nav = $(_menuListObj)
      var pageTabContent = $(_pageTabContent)
      var selDom = null
      if (typeof (tab) === 'string' || typeof (tab) === 'number') {
        selDom = nav.find("div[data-value='" + tab + "']")
      } else {
        selDom = $(tab)
      }
      var pageLeft = pageTabContent.offset().left
      var pageWidth = pageTabContent.width()

      var selLeft = $(selDom).offset().left
      var selWidth = $(selDom).width()

      var menuLeft = parseInt(nav.css('margin-left'))
      if (selLeft < pageLeft) {
        var targetMenuLeft = menuLeft + (pageLeft - selLeft) + 20
        nav.animate({
          'margin-left': targetMenuLeft + 'px'
        }, animatSpeed)
      } else if (selLeft + selWidth > pageLeft + pageWidth - 90) {
        var targetMenuLeft = menuLeft - (selLeft + selWidth - pageLeft - pageWidth + 150)
        nav.animate({
          'margin-left': targetMenuLeft + 'px'
        }, animatSpeed)
      }
    }
    /**
		 * 显示下拉项
		 */
    _this.showMenu = function () {
      var menuall = $(_menuAllObj)
      if (menuall.is(':visible')) {
        menuall.hide()
      } else {
        menuall.show()
      }
    }
    this.init()
    return this
  }
  exports('jqtab', {})
})
